<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>商品分类</title>
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		<link rel="stylesheet" type="text/css" href="css/header.css"/>
		<link rel="stylesheet" type="text/css" href="css/foot.css"/>
		<link rel="stylesheet" type="text/css" href="css/商品分类.css"/>
	</head>
	<body>
		<!--最上部信息部分-->
		<div class="ybox">
			<div class="ybox_top">
			<p>所在城市：郑州市中原区</p>
			<div class="ybox_right">
				<a href="javascript:void()"><span>登录</span></a>
				<a href="javascript:void()"><span>注册</span></a>
				<a href="javascript:void()"><span>我的订单</span></a>
				<a href="javascript:void()"><span>我的消息</span></a>
				<a href="javascript:void()"><span>我是商家</span></a>
				<a href="javascript:void()"><span class="yphone" style="border:none;">091---22511</span></a>
			</div>
			</div>
		</div>
		<!--主页的头部 礼拜五-->
		<header>
			<a href="###"><img src="img/ylogo.png" class="ylog"/></a>
			<input type="" placeholder="请输入关键字进行搜索" />
			<a href="###"><span class="ysea"><img src="img/yseare.png"/></span></a>
			<a href="###"><span class="yuser"><i>个人中心</i></span></a>
			<a href="###"><span class="yshop"><i>购物车</i></span></a>
			<div class="yhot">
				热门：<a href="###">杂粮饭</a>
				<a href="###">辣椒酱</a>
				<a href="###">水果篮子</a>
				<a href="###">擦玻璃</a>
				<a href="###">蟹肉棒</a>
				<a href="###">苹果</a>
			</div>
		</header>
		<!--导航部分-->
		<nav>
			<div class="alls">
				<span>全部分类</span>	
			
			<!--下拉出现的内容 利用定位来做,脱离文档流-->
			<ul class="ydetali">
				<li class="ydetali_one">
					<span class="yfruits">新鲜水果</span>
					<ul class="item_list">
						<li><a href="###">水果礼盒</a></li>
						<li><a href="###">进口水果</a></li>
						<li>有机水果</li>
						<li>国产水果</li>
					</ul>
				</li>
				<li class="ydetali_one">
					<span class="yseafood">生猛海鲜</span>
					<ul class="item_list">
						<li>海鲜礼盒</li>
						<li>国产海鲜</li>
						<li>进口海鲜</li>
						<li>干货其它</li>
					</ul>
				</li>
				<li class="ydetali_one">
					<span class="ymeat">肉类家禽</span>
					<ul class="item_list">
						<li>羊肉</li>
						<li>牛肉</li>
						<li>鸡鸭肉</li>
						<li>鱼肉</li>
					</ul>
				</li>
				<li class="ydetali_one">
					<span class="yegg">蛋奶素食</span>
					<ul class="item_list">
						<li>方便素食</li>
						<li>奶制品</li>
						<li>面包甜点</li>
						<li>单品</li>
					</ul>
				</li>
				<li class="ydetali_one">
					<span class="yveg">田园蔬菜</span>
					<ul class="item_list">
						<li>蔬菜礼篮</li>
						<li>有机蔬菜</li>
						<li>地产蔬菜</li>
						<li>进口蔬菜</li>
					</ul>
				</li>
				<li class="ydetali_one">
					<span class="ywine">零食酒水</span>
					<ul class="item_list">
						<li>零食</li>
						<li>特色果干</li>
						<li>休闲冲饮</li>
						<li>茶叶</li>
						<li>白酒</li>
						<li>啤酒</li>
						<li>葡萄酒</li>
						<li>其它酒品</li>
					</ul>
				</li>
				<li class="ydetali_one">
					<span class="yfood">粮油杂货</span>
					<ul class="item_list">
					    <li>米面</li>
						<li>杂粮</li>
						<li>调味</li>
						<li>食材</li>
					</ul>
				</li>
				
				<li>
					<span class="ygift">礼品卡券</span>
				</li>
				<li style="border: none;">
					<span class="yfurn">家具用品</span>
				</li>
			</ul>
			</div>
			<ul class="y_nav">
				<li>首页</li>
				<li>同城</li>
				<li>礼拜五</li>
				<li>积分商城</li>
				<li style="border: none;">导航+</li>
			</ul>
		</nav>
		<!--第三部分商品部分-->
		<div class="y_libaiwu">
		<div class="y_libaiwu_top">
			您当前位置:<span>首页 ></span><span>全部商品 ></span><span>苹果 ></span><strong>阿克苏</strong>
		</div>
		<div class=".y_conten_fresh">
			<!--分类部分-->
			<div class="y_conten_list">
				<span>一级分类:</span>
			    <a class="yone">全部</a>
				<a href="">苹果</a>
				<a>阿克苏</a>
				<a>酒店</a>
				<a>休闲</a>
				<a>电影</a>
			</div>
			<hr />
			<div class="y_conten_list">
				<span>二级分类:</span>
			    <a class="yone">全部</a>
				<a>苹果</a>
				<a>阿克苏</a>
				<a>酒店</a>
				<a>休闲</a>
				<a>电影</a>
			</div>
			<hr />
			<!--销量价格-->
			<div class="y_sv">
				<!--商品分类的左侧销量 价格和评分-->
				<div class="y_sv_left">
					<strong>排序:</strong><a href="###">销量</a>
					    <a href="###">价格</a>
					<a href="###">评分最高</a>
				</div>
				<div class="y_sv_right">
				筛选:
				<span>全国</span>
				<span>次日达</span>
				</div>
			</div>
			<!--总内容部分-->
			<div ng-app="myApp" ng-controller="myCtrl">
				<ul class="y_conten_two">
					<li ng-repeat="item in arr">
						<img src="{{item.src}}"/>
						<div>
						<h5>{{item.h5}}</h5>
						 <p>{{item.p}}</p>
						 <strong>{{item.strong}}</strong><em>{{item.em}}</em><img src="{{item.img}}" />
						</div>	
					</li>	
				</ul>
				</div>
				<!--底部的分页效果-->
				<ul class="y_page">
					<div><img src="img/page.png"/></div>
					<li>1</li>
					<li>2</li>
					<li>3</li>
					<li>4</li>
					<li>...</li>
					<li>10</li>
				    <div><img src="img/page.png"/ class="page_two"></div>
				    <input type="text"  class="page_three"/>
					<li>/10</li>
					<li>跳转</li>
				</ul>
				
				</div>
			</div>
		<!--底部内容-->
		<footer>
			<div class="y_footer">
			<ul> 
				<li class="one">
					<img src="img/y正品保障.png" alt="" />
					<sapn>优先保障</sapn>
				</li>
				<li>
					<img src="img/y全面监控.png"/>
					<span>全程监控</span>
				</li>
				<li>
					<img src="img/y精选特惠.png"/>
					<span>礼拜五特惠</span>
				</li>
				<li>
					<img src="img/y直供.png"/>
					<span>基地直供</span>
				</li>
				<li style="border: none;">
					<img src="img/y准时.png"/>
					<span>准时送达</span>
				</li>
			</ul>	
			<div class="y_bottom">
				<!--左-->
				<img src="img/底部.png" alt="" />
				<!--右-->
				<table cellspacing="15">
					<tr>
						<th>关于礼拜五</th>
						<th>配送说明</th>
						<th>售后服务</th>
						<th>加盟礼拜五</th>
					</tr>
					<tr>
						<td>新用户注册</td>
						<td>运费说明</td>
						<td>退货说明</td>
						<td>加盟条款</td>
					</tr>
					<tr>
						<td>在线下单</td>
						<td>配送方式</td>
						<td>服务保障承诺</td>
						<td>公司简介</td>
					</tr>
					<tr>
						<td>支付方式</td>
						<td>发票说明</td>
						<td>验货与签收</td>
						<td>服务协议</td>
					</tr>
				</table>
			 </div>
			</div>
				  <!--下最底部的文字-->
			    <div class="lastFoot">
				<img src="img/版权所有 © 礼拜五  保留所有权利 _ 沪ICP备12042163 .png"/><br />
				<img src="img/礼拜五  纵享品质 .png"/>
			</div>
			
		</footer>
		
		
	</body>
	<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
	<script src="js/header.js" type="text/javascript" charset="utf-8"></script>
	
	<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
//		var src=$("img").attr("src");
//		console.log(src);
		//获取模型
		var app=angular.module("myApp",[]);
		app.controller("myCtrl",function($scope){
			$scope.arr=[{h5:'新西兰佳配黄金奇异果',src:'img/dxg-img-13.png',p:'果肉绵密,花蜜般的甘甜白吃不厌',strong:'¥28.80',em:'¥40.00',img:'img/shop1.png'}];
		})
	</script>
	
</html>
